<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <link rel="stylesheet" href="./css/reset.css">
  <link rel="stylesheet" href="./fa/css/all.css">
  <link rel="stylesheet" href="./meitu/meitu.css">
</head>
<body>
  <div class="top-bar-wrapper">
    <div class="top-bar">
      <!-- 左侧菜单 -->
      <div class="left-menu">
          <!-- 创建菜单图标 -->
          <ul class="menu-icon">
              <li></li>
              <li></li>
              <li></li>
          </ul>

          <!-- 创建菜单 -->
          <ul class="nav">
            <li><a href="#">手机</a></li>
            <li><a href="#">美容仪器</a></li>
            <li><a href="#">配件</a></li>
            <li><a href="#">服务支持</a></li>
            <li><a href="#">企业网站</a></li>
            <li>
                <a href="#"><i class="fas fa-search"></i></a>
                <span>搜索 Meitu.com</span>
            </li>
          </ul>
      </div>

      <!-- logo -->
      <h1 class="logo">
          <a href="/">美图手机</a>
      </h1>

      <!-- 用户信息 -->
      <div class="user-info">
          <a href="#">
              <i class="fas fa-user"></i>
          </a>
      </div>
    </div>
  </div>  
</body>
</html>